<template>
  <view class="stats-page">
    <view class="header">
      <text class="title">统计概览</text>
      <text class="sub">以下图表为示例，后续将替换为后端数据</text>
    </view>

    <StatsCharts />
  </view>
</template>

<script setup>
import StatsCharts from '@/components/StatsCharts.vue'
</script>

<style lang="scss" scoped>
.stats-page { min-height: 100vh; background: linear-gradient(135deg, #faf8f5, #f5f2ed); padding: 20px; }
.header { text-align: center; margin-bottom: 16px; }
.title { display:block; font-size:24px; font-weight:700; color:#8b4513; font-family:'PingFang SC', 'Microsoft YaHei', sans-serif; }
.sub { display:block; margin-top:6px; color:#7a6a55; font-size:13px; }
.card { background: linear-gradient(135deg, rgba(255,255,255,0.95), rgba(245,242,237,0.95)); border-radius: 14px; padding: 14px 16px; box-shadow: 0 8px 24px rgba(212, 175, 55, 0.15); }
.desc { color:#5d4e37; font-size:14px; line-height:1.6; }
</style>

